<template name="basics">
	<view>
		<!-- 导航栏 -->
		<!-- #ifndef H5 -->
		<cu-custom bgColor="bg-gradual-red" :isBack="false">
			<block slot="backText">返回</block>
			<block slot="content">媒体资源共享平台</block>
		</cu-custom>
		<!-- #endif -->
		
		<scroll-view scroll-y class="page">
			<swiper class="screen-swiper" :class="dotStyle?'square-dot':'round-dot'" :indicator-dots="true" :circular="true"
			 :autoplay="true" interval="5000" duration="500">
				<!-- <swiper-item v-for="(item,index) in swiperList" :key="index">
					<image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
					<video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false" objectFit="cover" v-if="item.type=='video'"></video>
				</swiper-item> -->
				<swiper-item>
					<image src="../../static/carousel/p1.jpg" mode="aspectFill"></image>
				</swiper-item>
				<swiper-item>
					<image src="../../static/carousel/p2.jpg" mode="aspectFill"></image>
				</swiper-item>
				<swiper-item>
					<image src="../../static/carousel/p3.jpg" mode="aspectFill"></image>
				</swiper-item>
			</swiper>
			<view class="nav-list margin-top" v-if="hasLogin">
				<navigator hover-class="none" :url="'/pages/me/' + item.page" class="nav-li" navigateTo :class="'bg-'+item.color"
				 :style="[{animation: 'show ' + ((index+1)*0.2+1) + 's 1'}]" v-for="(item,index) in elements" :key="index">
					<view class="nav-title">{{item.title}}</view>
					<view class="nav-name">{{item.name}}</view>
					<text :class="'cuIcon-' + item.cuIcon"></text>
				</navigator>
			</view>
			<view class="cu-card" v-if="!hasLogin">
				<view class="cu-item">
					<view class="cu-form-group">
						<view class="title text-bold">游客，您好</view>
					</view>
					<view class="cu-form-group">
						<view class="title">您还没有登录，不能浏览平台的资源，</view>
					</view>
					<view class="cu-form-group">
						<view class="title">请点击 我的 选择 登录 </view>
					</view>
				</view>
			</view>
			<!-- <view class="cu-tabbar-height"></view> -->
		</scroll-view>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	export default {
		name: "basics",
		computed:mapState(['hasLogin','userName']),
		data() {
			return {
				elements: [{
						title: '图片',
						name: 'image',
						color: 'cyan',
						page: 'imageList',
						cuIcon: 'pic'
					},
					{
						title: '视频',
						name: 'video',
						page: 'videoList',
						color: 'blue',
						cuIcon: 'recordfill'
					},
					{
						title: '音频',
						name: 'voice',
						page: 'voiceList',
						color: 'purple',
						cuIcon: 'voice'
					},
					{
						title: '文档',
						name: 'office',
						page: 'officeList',
						color: 'mauve',
						cuIcon: 'text'
					},
					{
						title: '上传',
						name: 'upload',
						page: 'uploads',
						color: 'pink',
						cuIcon: 'upload'
					},
					{
						title: '回收站',
						name: 'delete',
						page: 'deleteList',
						color: 'brown',
						cuIcon: 'delete'
					}
				],
				swiperList: [],
				dotStyle: false,
				towerStart: '0',
				direction: ''
			};
		},

		created() {
			/* var serverUrl=this.server.url;
			uni.request({
				url: serverUrl + 'app/swiper',
				method: 'GET',
				data: {},
				success: res => {
					var result=res.data;
					this.swiperList=result.map(item=>{
						return {
							id: item.id,
							type:'image',
							url: serverUrl + 'sysFile/app/download?fileUuid='+item.fileUuid
						}
					})
				}
			}); */
			
		}
		
	}
</script>

<style>
	.page {
		height: 100vh;
	}
</style>
